<!-- 
在HTML标签中，<img> 标签用于定义HTML页面中的图像。
其格式为：
<img src="图像URL" /> 
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>图像标签</title>
</head>
<body>
    <!--
    src 是<img>标签的 必须属性 ，它用来指定图像文件的路径和文件名。
    img的各属性：
    属性    属性值    说明
    src    图片路径  必须属性
    alt     文本    替换文本。图像不能显示时的文字
    title   文本    提示文本，鼠标放到图像上，显示的文字
    width   像素    设置图像的宽度
    height  像素    设置图像的高度
    border  像素    设置图像的边框粗细
    
    所谓属性：简单理解就是属于这个图像标签的特性。
    -->
    <h4> 图像标签的使用： </h4>
    <img src="./jpg.png" />
    <h4> alt 替换文本 图像显示不出来的时候用文字替换： </h4>
    <img src="./jpg1.png" alt="我是靓仔"/>
    <h4> title 提示文本 鼠标放到图像上，显示的文字： </h4>
    <img src="./jpg.png" alt="我是靓仔" title="我是靓仔"/>
    
    <!--
    height 和 width属性一般只更改其中一个，另一个会等比例缩放。
    -->
    <h4> height 给图像设定高度： </h4>
    <img src="./jpg.png" alt="我是靓仔" title="我是靓仔" height="500" />
    <h4> width 给图像设定宽度： </h4>
    <img src="./jpg.png" alt="我是靓仔" title="我是靓仔" width="500" />

    <h4> border 给图像设定边框：</h4>
    <img src="./jpg.png" alt="我是靓仔" title="我是靓仔" width="500" border="15px"/>
    <!--
    图像标签属性注意点：
    
    1.图像标签可以拥有多个属性，必须写在标签名的后面。
    2.属性之间不分先后顺序，标签名和属性、属性与属性之间均以空格分开。
    3.属性采取键值对的格式，即 key = “value” 的格式，属性 = “属性值”。
    -->
</body>
</html>